<template>
  <div class="big">
    <el-table :data="tableData" style="width: 97.9%;text-align: center;" border stripe>
      <el-table-column prop="name" label="店铺名" width="160px"> </el-table-column>
      <el-table-column prop="merchantName" label="店主" width="160px"> </el-table-column>
      <el-table-column prop="desc" label="简介" width="160px"> </el-table-column>
      <el-table-column prop="Type" label="店铺类型" width="160px"> </el-table-column>
      <el-table-column prop="address" label="地址" width="160px"> </el-table-column>
      <el-table-column prop="registerMoney" label="注册资金" width="160px"> </el-table-column>
      <el-table-column prop="state" label="审核状态" width="160px">
        <template slot-scope="scope" >
          <p v-if="scope.row.state == 1">未审核</p>
          <p v-else-if="scope.row.state == 2">审核成功</p>
          <!-- <p v-if="!scope.row.state">冻结</p> -->
          <p v-else-if="scope.row.state == 3">审核失败</p>
        </template>
      </el-table-column>
      <el-table-column label="操作" width="160px">
        <template slot-scope="scope">
        <el-button
          size="mini"
          @click="handleSuccess(scope.row)">通过</el-button>
        <el-button
          size="mini"
          type="danger"
          @click="handleFail(scope.row)">不通过</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import axios from 'axios'
export default {
  data() {
    return {
      tableData: [
        {
          name: '',
          merchantName: '',
          desc: '',
          Type: '',
          address: '',
          registerMoney: 10000,
          state: 1,
        },
      ],
    };
  },
  created() {
      this.getShopList();
  },
  methods: {
    async getShopList() {
      const { data } = await axios.get('/admin/getShopList');
      this.tableData = data;
    },
    //通过审核
    async handleSuccess(params) {
      if(params.state == 1 || params.state == 3) {
        let { data } = await axios.post('/admin/handleSuccess',params);
        params.state = data.data;
        this.getShopList();
      }
      else {
        alert('商店已通过审核!');
      }
    },
    // 不通过审核
    async handleFail(params) {
      if(params.state == 1 || params.state == 2) {
        let { data } = await axios.post('/admin/handleFail',params);
        params.state = data.data;
        this.getShopList();
      }
      else {
        alert('商店已审核失败!');
      }
    },
  }
};
</script>

<style>
  * {
    text-align: center;
  }
  .big {
    width: 100%;
    height: 100%;
  }
  .el-table {
    margin: 0 auto;
  }
  .el-table th, .el-table tr {
    height: 40px;
    line-height: 40px;
  }
  .has-gutter,.el-table__body {
    width: 100%;
  }
  .el-form-item__content {
    margin-top: 63px;
  }
</style>
